let historyLoaded = 0;
let lastTotalLoaded = 0;
let timer; // 用于控制更新速率的定时器
let isUpdating = false; // 标志是否正在更新

async function getTokenAndDomain() {
  try {
    // console.log('开始获取 token 和 domain');
    const response = await fetch('/token');
    const data = await response.json();
    // console.log('解析出来的 token:', data.token);
    // console.log('解析出来的 domain:', data.domain);
    return { token: data.token, domain: data.domain };
  } catch (error) {
    console.error('获取 token 和 domain 出错:', error);
    return null;
  }
}

function startUpload(btn) {
  // console.log('点击上传按钮，开始执行 startUpload 函数');

  // 检查文件是否为空
  const file = document.getElementById('fileInput').files[0];
  if (!file) {
    alert('请选择要上传的文件！');
    return;
  }
  btn.disabled = true; // 锁定上传按钮

  // 处理获取 token 和 domain 失败的情况
  getTokenAndDomain().then(result => {
    if (result) {
      // console.log('准备创建上传器');

      // 获取选择的文件
      const key = file.name;  // 设置 key 为文件的原名称

      const putExtra = {};  // 根据需要设置额外参数
      const config = {};  // 根据需要设置配置参数

      const observable = qiniu.upload(file, key, result.token, putExtra, config);

      const subscription = observable.subscribe({
        next(response) {
          // console.log('上传进度:', response);

          updateUploadStatus(response);
        },

        error(err) {
          console.error('上传出错:', err);
        },
        complete(res) {
          // console.log('上传完成');
          clearInterval(timer); // 上传完成时清除定时器
          const progressBar = document.querySelector('.threeD-progress-bar');
          progressBar.style.width = `100%`;
          const percentageText = document.getElementById('percentageText');
          percentageText.innerHTML = `100%`;
          const rateElement = document.getElementById('rate');
          rateElement.innerHTML = '上传速率: 0 B/s';  // 上传完成时将速率归零

          const file = document.getElementById('fileInput').files[0];
          // console.log('准备发送变量');
          const key = file.name;
          // console.log(key);
          const fileSize = file.size;  // 从上传响应中获取文件大小
          // console.log(fileSize);

          const formData = new FormData();
          formData.append('key', key);
          formData.append('fileSize', fileSize);
          // 新增：上传完成后发送请求到 upload_success
          // console.log('准备发送请求');
          fetch('/upload_success', {
            method: 'POST',
            body: formData
          })
        .then(response => {
            if (response.ok) {
              // console.log('请求发送成功');
              return response.json();  // 解析 JSON 数据
            } else {
              console.error('请求发送失败');
            }
          })
       .then(data => {
          // console.log(data);
          const currentUrl = window.location.href;
          const fileUrl = `${currentUrl}${data.url_id}`;

          // 创建弹窗并添加遮罩
          const popup = document.createElement('div');
          popup.style.position = 'fixed';
          popup.style.top = '50%';
          popup.style.left = '50%';
          popup.style.transform = 'translate(-50%, -50%)';
          popup.style.backgroundColor = '#fff';
          popup.style.padding = '20px';
          popup.style.border = '1px solid #ccc';
          popup.style.borderRadius = '5px';
          popup.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.5)';

          const mask = document.createElement('div');
          mask.style.position = 'fixed';
          mask.style.top = '0';
          mask.style.left = '0';
          mask.style.width = '100%';
          mask.style.height = '100%';
          mask.style.backgroundColor = 'rgba(0, 0, 0, 0.5)';

          document.body.appendChild(mask);
          document.body.appendChild(popup);

          // 添加标题
          const title = document.createElement('h3');
          title.innerHTML = '上传成功窗口';
          popup.appendChild(title);

          // 弹窗内容
          popup.innerHTML += `<p>文件上传成功，地址为：</p>
            <p>${fileUrl}</p>
            <button onclick="copyToClipboard('${fileUrl}')">一键复制</button>
            <button onclick="window.location.href = '${fileUrl}'">立即访问</button>
            <button onclick="closePopup(this)">关闭</button>`;

        })
        .catch(error => {
            console.error('请求发送时出错:', error);
          });

          btn.disabled = false; // 上传完成解锁按钮
          document.getElementById('fileInput').value = ''; // 清除选择的文件
          return;
        }
      });
    } else {
      // 处理获取 token 和 domain 失败的情况
      console.error('获取 token 和 domain 失败，无法进行上传操作');
      btn.disabled = false; // 解锁上传按钮
    }
  }, error => {
    console.error('获取 token 和 domain 时发生错误:', error);
    btn.disabled = false; // 解锁上传按钮
  });
}

function updateUploadStatus(response) {
  if (isUpdating) {
    return; // 如果正在更新，直接返回，不执行本次更新
  }

  isUpdating = true; // 设置正在更新标志

  // 进度条
  const totalPercent = parseFloat(response.total.percent).toFixed(2);

  const fileSize = response.total.loaded;  // 文件总大小

  // 计算上传速率
  const totalLoaded = response.total.loaded;  // 已上传文件大小

  lastTotalLoaded = totalLoaded; // 更新本次已上传大小

  let speed = totalLoaded - historyLoaded;

  historyLoaded = lastTotalLoaded

  let rateText;
  if (speed < 1024) {
    rateText = `上传速率: ${speed.toFixed(2)} B/s`;
  } else if (speed < 1024 * 1024) {
    rateText = `上传速率: ${(speed / 1024).toFixed(2)} KB/s`;
  } else {
    rateText = `上传速率: ${(speed / (1024 * 1024)).toFixed(2)} MB/s`;
  }

  const progressBar = document.querySelector('.threeD-progress-bar');
  progressBar.style.width = `${totalPercent}%`;
  const percentageText = document.getElementById('percentageText');
  percentageText.innerHTML = `${totalPercent}%`;
  const rateElement = document.getElementById('rate');
  rateElement.innerHTML = rateText;

  // 1 秒钟后重置更新标志
  timer = setTimeout(() => {
    isUpdating = false;
  }, 1000);
}

// 一键复制功能
function copyToClipboard(text) {
  const textarea = document.createElement('textarea');
  textarea.value = text;
  document.body.appendChild(textarea);
  textarea.select();
  document.execCommand('copy');
  document.body.removeChild(textarea);
}

// 关闭弹窗并重置进度条
function closePopup(btn) {
  const popup = btn.parentNode;
  const mask = document.querySelector('div[style*="rgba(0, 0, 0, 0.5)"]');
  document.body.removeChild(popup);
  document.body.removeChild(mask);

  const progressBar = document.querySelector('.threeD-progress-bar');
  progressBar.style.width = `0%`;
  const percentageText = document.getElementById('percentageText');
  percentageText.innerHTML = `0%`;
  const rateElement = document.getElementById('rate');
  rateElement.innerHTML = '上传速率: 0 B/s';
}